﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
    Layout = null;
}

<link href="~/lib/layui/css/layui.css" rel="stylesheet" />
<script src="~/lib/layui/layui.js"></script>
<script src="~/js/js.cookie.js"></script>
<script src="~/js/moment.js"></script>
<script src="~/lib/jquery/dist/jquery.js"></script>




<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Demo</title>
    <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
    <link href="//unpkg.com/layui@2.9.18/dist/css/layui.css" rel="stylesheet">
</head>
<body>
    
    <div style="float:left;width:300px;">
        <div id="ID-tree-demo-showLine"></div>
    </div>
    <div style="float:right;margin-right:20px;">
        <form class="layui-form">

            <h2>部门信息</h2>
            <hr class="layui-border-green">
            <br />
            <div class="layui-form-item">
                <label class="layui-form-label">部门上级</label>
                <div class="layui-input-block">
                    <input type="text" id="departmentSuperior" placeholder="请输入" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">部门名称</label>
                <div class="layui-input-block">
                    <input type="text" id="departmentName" placeholder="请输入" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">部门停用</label>
                <div class="layui-input-block">
                    <input type="radio" name="departmentDeactivatebool" id="departmentDeactivatebool" value="启用" title="启用" checked>
                    <input type="radio" name="departmentDeactivatebool" id="departmentDeactivatebool" value="禁用" title="禁用">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">部门类型</label>
                <div class="layui-input-block">
                    <select name="city" id="departmentTypeId" lay-filter="aihao">
                        <option value="">请选择部门类型</option>
                        <option value="行政管理">行政管理</option>
                        <option value="生产加工">生产加工</option>
                        <option value="业务销售">业务销售</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">部门序号</label>
                <div class="layui-input-block">
                    <input type="text" id="departmentOrdinal" placeholder="请输入" class="layui-input" disabled="disabled">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">部门区域</label>
                <div class="layui-input-inline">
                    <select id="provinceId" lay-filter="provincet">
                        <option value="">请选择</option>
                    </select>
                </div>
                <div class="layui-input-inline">
                    <select id="directlyId" lay-filter="city">
                        <option value="">请选择</option>
                    </select>
                </div>

                <div class="layui-input-inline">
                    <select id="countyId" lay-filter="directly">
                        <option value="">请选择</option>
                    </select>
                </div>

            </div>
            

            <h2>任职信息</h2>
            <hr class="layui-border-green">
            <br />
            <div class="layui-form-item">
                <label class="layui-form-label">直接上级</label>
                <div class="layui-input-block">
                    <input type="text" id="directSuperior" placeholder="请输入" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">部门主管</label>
                <div class="layui-input-block">
                    <select name="city" id="departmentSupervisor" lay-filter="aihao">
                        <option value="">请选择部门主管</option>
                        <option value="陆雪琪">陆雪琪</option>
                        <option value="黄赛超">黄赛超</option>
                        <option value="李颖">李颖</option>
                        <option value="刘瑞">刘瑞</option>
                        <option value="刘明">刘明</option>
                        <option value="刘超">刘超</option>
                        <option value="李辉">李辉</option>
                        <option value="李艳芬">李艳芬</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">分管负责人</label>
                <div class="layui-input-block">
                    <select name="city" id="inChargeHead" lay-filter="aihao">
                        <option value="">请选择部门主管</option>
                        <option value="陆雪琪">陆雪琪</option>
                        <option value="黄赛超">黄赛超</option>
                        <option value="李颖">李颖</option>
                        <option value="刘瑞">刘瑞</option>
                        <option value="刘明">刘明</option>
                        <option value="刘超">刘超</option>
                        <option value="李辉">李辉</option>
                        <option value="李艳芬">李艳芬</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">财务主管</label>
                <div class="layui-input-block">
                    <select name="city" id="treasurer" lay-filter="aihao">
                        <option value="">请选择部门主管</option>
                        <option value="陆雪琪">陆雪琪</option>
                        <option value="黄赛超">黄赛超</option>
                        <option value="李颖">李颖</option>
                        <option value="刘瑞">刘瑞</option>
                        <option value="刘明">刘明</option>
                        <option value="刘超">刘超</option>
                        <option value="李辉">李辉</option>
                        <option value="李艳芬">李艳芬</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">可查看人员</label>
                <div class="layui-input-block">
                    <input type="text" id="viewablePersonnel" placeholder="请输入" class="layui-input">
                </div>
            </div>

            <h2>组织信息</h2>
            <hr class="layui-border-green">
            <br />
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <input type="text" id="functionalSystemId" placeholder="请输入" class="layui-input">
                </div>
                <label class="layui-form-label">职能体系</label>
                <div>
                    <div id="ID-tree-demo-showLines"></div>
                </div>
            </div>

            <input type="button" class="layui-btn" lay-submit lay-filter="demo1" onclick="add()" value="保存" />

        </form>
    </div>
    
</body>

</html>

<script>



    $(function () {
        var n = new Date();
        var strr = n.getFullYear() + (n.getMonth() + 1).toString().padStart(2, '0') + n.getDate().toString().padStart(2, '0') + n.getHours().toString().padStart(2, '0') + n.getMinutes().toString().padStart(2, '0') + n.getSeconds();
        var sj = Math.floor(Math.random() * 90 + 10);
        var stra = n.getFullYear() + '-' + (n.getMonth() + 1).toString().padStart(2, '0') + '-' + n.getDate().toString().padStart(2, '0');
        $("#departmentOrdinal").val(strr)
    })
    layui.use(function () {
        var form = layui.form;
        var layer = layui.layer;
        var tree = layui.tree;
        var layer = layui.layer;
        var element = layui.element;
        var datas = [];


       
        var $ = layui.$;
        $(function () {
            bangsheng();
        })


        //省
        function bangsheng() {
            $.ajax({
                url: "http://localhost:5123/api/Regions/ProvinceQuerys",
                data: JSON.stringify({}),
                type: "post",
                async: false,
                dataType: "json",
                contentType: "application/json",
                success: res => {
                    console.log(res)
                    $.each(res.data, function () {
                        $("#provinceId").append(`<option value="${this.provinceId}">${this.provinceName}</option>`);
                    })
                    form.render('select'); // 重新渲染下拉框
                }

            })
        }
        var provincetId1 = 0;
        var cityid = 0;
        form.on('select(provincet)', function (data) {
            provincetId1 = data.value;
            console.log(provincetId1)
            $("#directlyId").empty();
            $("#directlyId").append(`<option value="">请选择</option>`);
            $("#countyId").empty();
            $("#countyId").append(`<option value="">请选择</option>`);
            bangshi()

        });
        form.on('select(city)', function (data) {
            cityid = data.value;
            console.log(provincetId1)
            $("#countyId").empty();
            $("#countyId").append(`<option value="">请选择</option>`);
            bangxian();

        });

        //市
        function bangshi() {
            var provinceId = $("#provinceId").val();
            $.ajax({
                url: "http://localhost:5123/api/Regions/CityQuerys",
                data: JSON.stringify({ provinceId: provincetId1 }),
                type: "post",
                async: false,
                dataType: "json",
                contentType: "application/json",
                success: res => {

                    console.log(res.data)
                    $.each(res.data, function () {

                        $("#directlyId").append(`<option value="${this.directlyId}">${this.directlyName}</option>`);
                    })
                    form.render('select'); // 重新渲染下拉框
                }

            })
        }
        //县
        function bangxian() {
            var directlyId = $("#directlyId").val();
            $.ajax({
                url: "http://localhost:5123/api/Regions/CountyQuerys",
                data: JSON.stringify({ directlyId: cityid }),
                type: "post",
                async: false,
                dataType: "json",
                contentType: "application/json",
                success: res => {

                    $.each(res.data, function () {
                        $("#countyId").append(`<option value="${this.countyId}">${this.countyName}</option>`);
                    })
                    form.render('select'); // 重新渲染下拉框
                }

            })
        }

        function treeList1() {

            $.post({
                url: "http://localhost:5123/api/Department/FunctionalSystemTreeQuery",

                data: JSON.stringify({}),
                dataType: "json",
                contentType: "application/json",
                success: d => {
                    datas = d.data;
                    console.log(datas);
                    tree.render({
                        elem: '#ID-tree-demo-showLines',
                        data: datas,
                        showLine: false, // 是否开启连接线
                        click: function (res) {
                            
                            $("#functionalSystemId").val(JSON.stringify(res.data.label));
                            console.log(res)
                        }
                    });
                }
            })
        }

        // 渲染
        treeList1();






        function treeList() {

            $.post({
                url: "http://localhost:5123/api/Department/DepartmentTreeQuery",

                data: JSON.stringify({}),
                dataType: "json",
                contentType: "application/json",
                success: d => {
                    datas = d.data;
                    console.log(datas);
                    tree.render({
                        elem: '#ID-tree-demo-showLine',
                        data: datas,
                        showLine: false, // 是否开启连接线
                        click: function (res) {
                            
                            $("#departmentSuperior").val(JSON.stringify(res.data.label));
                            $("#departmentName").val(JSON.stringify(res.data.label));
                            console.log(res)
                        }
                    });
                }
            })
        }

        // 渲染
        treeList();
    });

    function add() {

        var data = {
            departmentSuperior: $("#departmentSuperior").val(),
            departmentDeactivatebool: $("[name=departmentDeactivatebool]:checked").val(),
            departmentName: $("#departmentName").val(),
            departmentTypeId: $("#departmentTypeId").val(),
            departmentOrdinal: $("#departmentOrdinal").val(),
            directSuperior: $("#directSuperior").val(),
            countyId: $("#countyId").val(),
            departmentSupervisor: $("#departmentSupervisor").val(),
            inChargeHead: $("#inChargeHead").val(),
            treasurer: $("#treasurer").val(),
            viewablePersonnel: $("#viewablePersonnel").val(),
            functionalSystemId: $("#functionalSystemId").val(),
        }
        console.log(data);
        $.ajax({
            url: "http://localhost:5123/api/Department/AddDepartment",
            type: 'post',
            data: JSON.stringify(data),
            dataType: "json",
            contentType: "application/json",
            success: d => {
                if (d == 0) {
                  layer.msg('保存失败');
                }
                else {
                    layer.msg('保存成功');
                }
            }
        })
    }







</script>
